/*
Script: Element.ComputedStyle.js
	Specs for Element.ComputedStyle.js

License:
	MIT-style license.
*/
describe('Element.getComputedStyle', {
	
	"should return pixies also for non pixies values": function() {		
		var el = new Element('div', {			
			style: 'position: absolute; width: 10em; padding-left: 10%; margin-left: 10pt; left: 50ex'
		}).inject(document.body);
		value_of(el.getComputedStyle('width').contains('px')).should_be_true();
		value_of(el.getComputedStyle('padding-left').contains('px')).should_be_true();
		value_of(el.getComputedStyle('margin-left').contains('px')).should_be_true();
		value_of(el.getComputedStyle('left').contains('px')).should_be_true();
	},

	"should return colors always in rgb": function() {
		var el = new Element('div', {
			style: 'color: #65C400; background-color: #227700'
		}).inject(document.body); 
		value_of(el.getComputedStyle('color')).should_be('rgb(101, 196, 0)');
		value_of(el.getComputedStyle('background-color')).should_be('rgb(34, 119, 0)');		
	},
	
	"should return colors always in rgb also for edges": function() {
		var el = new Element('div', {
			style: 'color: white; background-color: black'
		}).inject(document.body); 
		value_of(el.getComputedStyle('color')).should_be('rgb(255, 255, 255)');
		value_of(el.getComputedStyle('background-color')).should_be('rgb(0, 0, 0)');		
	},
	
	// IE knows only backgroundPositionX and backgroundPositionY
	"should return background position": function() {
		var el = new Element('div', {
			style: 'color: white; background-position: 1px 1px'
		}).inject(document.body); 
		value_of(el.getComputedStyle('background-position')).should_be('1px 1px');		
	},
	
	"should return float": function() {
		var el = new Element('div', {
			style: 'color: white; float: left'
		}).inject(document.body); 
		value_of(el.getComputedStyle('float')).should_be('left');		
	},
    
    "should convert percentage border widths properly": function() {
      var el = new Element('div', {
          style: 'width: 100px; height: 100px; border: 1% solid #000;'
      }).inject(document.body);
      value_of(el.getComputedStyle('border-left-width')).should_be('1px');
    },
    
    "should return negative values if style is negative number": function() {
		var el = new Element('div', {
			style: 'margin-left: -1em;'
		}).inject(document.body);
        
        console.log(el.getStyle('margin-left'));
        
        value_of(el.getComputedStyle('margin-left')).should_be('-11px');
    }
    
});
